<template>
    <div>
      <div class="result-item" v-for="item in searchResult" :key="item.id">
        <div class="result-item-title">{{ item.title }}</div>
        <div class="result-item-time">{{ item.time }}</div>
        <el-button type="text" @click="handleViewNotice(item)">查看</el-button>
      </div>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[5, 10, 20, 50]"
        :page-size="pageSize"
        :total="total"
        layout="total, sizes, prev, pager, next, jumper"
        style="text-align:center; margin-top:20px; ">
      </el-pagination>
    </div>
  </template>
  <script>
  
  export default {
    data() {
      return {
        searchResult: [],
        currentPage: 1,
        pageSize: 5,
        total: 0,
        keyword: '',
        type: '',
      };
    },
    // created() {
    //     this.search();
    // },
    methods: {
      // 每页显示数据量改变时触发
      handleSizeChange(size) {
       this.pageSize = size
       this.search();
      },
      // 当前页码改变时触发
      handleCurrentChange(val) {
        this.currentPage = val;
        this.search();
      },
      search() {
        this.request.get('/index/search', {
          params: {
            keyword: this.$route.params.keyword,
            type: this.$route.params.type,
            page: this.currentPage,
            pageSize: this.pageSize,
          },
        })
        .then(response => {
            console.log(response.data)
          // 处理后端返回的结果
          this.searchResult = response.data.data.list;
          this.total = response.data.data.total;
        })
        .catch(error => {
          // 处理请求错误
          console.log(error);
        });
      },
      //查看详情
    handleViewNotice(item) {
        console.log(this.$route.params.type);
        if(this.$route.params.type == 1){
         this.$router.push({ name: 'AnnDetail', params: { id: item.id } });
        }
        else if(this.$route.params.type == 2 ){
            this.$router.push({ name: 'ComDetail', params: { id: item.id } });
        }
      },
    },

    watch: {
      keyword: {
        handler() {
          this.currentPage = 1;
          this.search();
        },
        immediate: true,
      },
      type: {
        handler() {
          this.currentPage = 1;
          this.search();
        },
        immediate: true,
      },
    },
  };
  </script>
  <style>
  .result-item {
    margin-bottom: 20px;
    border: 1px solid #eee;
    padding: 10px;
  }
  
  .result-item-title {
    font-weight: bold;
    font-size: 20px;
  }
  
  .result-item-content {
    margin-top: 10px;
    font-size: 16px;
  }
  
  .result-item-time {
    margin-top: 10px;
    font-size: 14px;
    color: #aaa;
  }
  </style>